import { Component, OnInit, Input } from '@angular/core';

import { ModalController, NavParams } from '@ionic/angular';

import { AppGlobalService } from "../../shared/service/app-global.service";
import { EventService } from '../../shared/service/event.service';
import { HttpService } from '../../shared/service/http.service';
import { MapBaiduService } from '../../shared/service/map.baiduapi';
declare var BMap;
declare let $: any;
@Component({
    selector: 'app-new-choose-city',
    templateUrl: './new-choose-city.component.html',
    styleUrls: ['./new-choose-city.component.scss']
})
export class NewChooseCityComponent implements OnInit {

    constructor(
        private modalController: ModalController,
        // private navParams: NavParams,
        private httpService: HttpService,
        private mapBaiduService: MapBaiduService,
        private appGlobalService: AppGlobalService,
        private eventService: EventService
    ) {
    }
    @Input() tagData: any = {};
    areaList: any = [];
    citys: any = {};
    key: string;      // 用于搜索结果

    target: number;

    data: any = [];
    titleData: any = [];
    groupAddress: any;
    startGroupAddress: any;
    hotCities: any;
    submit: any;
    showIcon: any;
    // 页面变量
    chooseColor = false;  // false说明 chooseText 字体颜色是高亮的
    chooseText = '请选择';
    isClick = true;
    addressTitleBtnIndex: any; // 记录点击 第几个 title
    ngOnInit() {
        this.hotCities = this.tagData.hotCities.data ? this.tagData.hotCities.data : [];
        this.startGroupAddress = this.tagData.groupCities.data ? this.tagData.groupCities.data : [];
        this.submit = this.tagData.submit ? this.tagData.submit : undefined;
        // 是否显示关闭按钮
        this.showIcon = true;


        console.log(this.appGlobalService.selectAddressList);
        // 说明是来修改地址的
        if(this.appGlobalService.selectAddressList && this.appGlobalService.selectAddressList !== '' && this.appGlobalService.selectAddressList !== undefined) {
            this.areaList.push(this.startGroupAddress);

            this.data = this.appGlobalService.selectAddressList;
            this.submit.sessionId = localStorage.getItem('sessionId');
            let length = this.data.length - 1;
            this.data.forEach((e,i) => {
                this.submit.content.code = e.code;
                this.httpService.post('application/submit', this.submit, (res) => {
                    if (res.success) {
                        if (res.data && res.data.data) {
                            this.areaList[i+1] = res.data.data;
                            if ((i+1) === length) {
                                this.groupAddress = res.data.data;
                            }
                        }
                    }
                })
            });
            
            this.chooseText = this.data[this.data.length - 1].name;
        } else {
            // 新增地址
            this.groupAddress = this.tagData.groupCities.data ? this.tagData.groupCities.data : [];
            this.areaList.push(this.groupAddress);
        }
    }
    ngAfterViewInit() {
        let dom = document.querySelector('.index-list');
        if(dom) {
            dom['style'].paddingBottom = '6rem';
            dom['style'].overflow = 'unset';
        }
    }
    doDiss() {
        this.modalController.dismiss({});
    }

    doClose(cityObj) {

            if (this.submit && this.isClick === true) {
                this.isClick = false;
                // 使用 code 请求出下一级数据
                this.submit.content.code = cityObj.i;
                this.submit.sessionId = localStorage.getItem('sessionId');
                this.httpService.post('application/submit', this.submit, (res) => {
                    if (res.success) {
                        if (res.data && res.data.data) {

                            if(this.addressTitleBtnIndex !== '' && this.addressTitleBtnIndex !== undefined) {
                                this.areaList = this.areaList.slice(0, this.addressTitleBtnIndex + 1);
                                this.data = this.data.slice(0, this.addressTitleBtnIndex);
                                this.chooseColor = false;
                                this.chooseText = '请选择';
                                this.data.forEach(e => {
                                    e.active = false;
                                });
                                this.addressTitleBtnIndex = '';
                            }
                            this.areaList.push(res.data.data);
                            this.groupAddress = res.data.data;
                            let timer = setTimeout(() => {
                                let dom = document.querySelector('.index-list-wrapper');
                                if(dom) {
                                    dom.scrollTop = 0;
                                }
                                clearTimeout(timer);
                            }, 10);
                            this.data.push({
                                text: cityObj.n,
                                name: cityObj.n,
                                code: cityObj.i
                            });
                            this.data.forEach(e => {
                                console.log(e.name);
                            });
                            console.log('----');
                        } else {
                            if (cityObj.i === this.data[this.data.length - 1].code || cityObj.i.length === this.data[this.data.length - 1].code.length){
                                this.data.pop();
                            }
                            this.chooseText = cityObj.n;
                            this.chooseColor = true;
                            this.data.push({
                                name: cityObj.n,
                                code: cityObj.i
                            });
                            console.log('----');
                            console.log(this.data);
                            const address = this.appGlobalService.countTotal(this.data, "name");
                            this.modalController.dismiss({data: { data: this.data, code: cityObj.i, address}});
                        }
                        this.isClick = true;
                    }
                });
            }

    }
    addressTitleBtn(item, i, data) {
        this.groupAddress =  this.areaList[i];
        let timer = setTimeout(() => {
            let dom = document.querySelector('.index-list-wrapper');
            if(dom) {
                dom.scrollTop = 0;
            }
            clearTimeout(timer);
        }, 10);
        this.addressTitleBtnIndex = i;
        data.forEach(e => {
            e.active = false;
        });
        item.active = true;
        this.chooseColor = true;
    }

    changeColor() {
        this.data.forEach(e => {
            e.active = false;
        });
        this.chooseColor = false;
        this.groupAddress = this.areaList[this.areaList.length - 1];
    }

    ngOnDestroy(): void {
        this.appGlobalService.selectAddressList = '';
        console.log(this.appGlobalService.selectAddressList+'--');
    }
}
